// 注册图表dom
var curIndex = -1
var rain_poss_diff_chart = echarts.init(document.getElementById("rain_poss_diff_chart"), null, { renderer: 'svg' })
var max_temp_diff_chart = echarts.init(document.getElementById("max_temp_diff_chart"), null, { renderer: 'svg' })
var min_temp_diff_chart = echarts.init(document.getElementById("min_temp_diff_chart"), null, { renderer: 'svg' })
var word_cloud = echarts.init(document.getElementById('word_cloud'))
var biggest_temp_diff = echarts.init(document.getElementById('biggest_temp_diff'))

var chart_list = [rain_poss_diff_chart, max_temp_diff_chart, min_temp_diff_chart]

function hideAllTips() {
    chart_list.forEach(chart => {
        chart.dispatchAction({
        type: 'hideTip'
        })
    })
}

function setDefaultTitle(chart, str) {
    var option = chart.getOption()
    option.title[0].text = str
    option.title[0].subtext = ''
    chart.setOption(option)
}

function changeTitleByOption(chart, option) {
    let sufix
    if (chart == rain_poss_diff_chart) {
        sufix = "降水概率"
    }else if (chart == max_temp_diff_chart){
        sufix = "最高气温"
    }else {
        sufix = "最低气温"
    }

    option.title[0].text = option.xAxis[0].data[curIndex]
    option.title[0].subtext = sufix + option.series[0].data[curIndex]
    chart.setOption(option)


}

chart_list.forEach(chart => {
    chart.on('globalout', function (event) {
        setDefaultTitle(max_temp_diff_chart, '最高气温')
        setDefaultTitle(min_temp_diff_chart, '最低气温')
        setDefaultTitle(rain_poss_diff_chart, '降水概率')
        hideAllTips()
    })
})

rain_poss_diff_chart.on('updateAxisPointer', function(event) {
    if (event.dataIndex == curIndex) return
    hideAllTips()
    curIndex = event.dataIndex

    max_temp_diff_chart.dispatchAction({
        type: 'showTip',
        seriesIndex: 0,
        dataIndex: curIndex,
    })

    min_temp_diff_chart.dispatchAction({
        type: 'showTip',
        seriesIndex: 0,
        dataIndex: curIndex,
    })

    changeTitleByOption(max_temp_diff_chart, max_temp_diff_chart.getOption())
    changeTitleByOption(min_temp_diff_chart, min_temp_diff_chart.getOption())
    changeTitleByOption(rain_poss_diff_chart, rain_poss_diff_chart.getOption())
})

max_temp_diff_chart.on('updateAxisPointer', function(event) {
    if (event.dataIndex == curIndex) return
    hideAllTips()
    curIndex = event.dataIndex

    rain_poss_diff_chart.dispatchAction({
        type: 'showTip',
        seriesIndex: 0,
        dataIndex: curIndex,
    })

    min_temp_diff_chart.dispatchAction({
        type: 'showTip',
        seriesIndex: 0,
        dataIndex: curIndex,
    })

    changeTitleByOption(max_temp_diff_chart, max_temp_diff_chart.getOption())
    changeTitleByOption(min_temp_diff_chart, min_temp_diff_chart.getOption())
    changeTitleByOption(rain_poss_diff_chart, rain_poss_diff_chart.getOption())
})

min_temp_diff_chart.on('updateAxisPointer', function(event) {
    if (event.dataIndex == curIndex) return
    hideAllTips()
    curIndex = event.dataIndex

    max_temp_diff_chart.dispatchAction({
        type: 'showTip',
        seriesIndex: 0,
        dataIndex: curIndex,
    })

    rain_poss_diff_chart.dispatchAction({
        type: 'showTip',
        seriesIndex: 0,
        dataIndex: curIndex,
    })

    changeTitleByOption(max_temp_diff_chart, max_temp_diff_chart.getOption())
    changeTitleByOption(min_temp_diff_chart, min_temp_diff_chart.getOption())
    changeTitleByOption(rain_poss_diff_chart, rain_poss_diff_chart.getOption())
})

// 加载图表数据 节省流量访问 数据在table中获取 注意函数声明顺序
function loadAllChart() {
    rain_poss_diff_chart.setOption(get_rain_poss_chart_option())
    max_temp_diff_chart.setOption(get_max_temp_diff_chart_option())
    min_temp_diff_chart.setOption(get_min_temp_diff_chart_option())
    word_cloud.setOption(get_word_cloud_option())

}
$(function () {

    const timeFomatter = function (base) {
        let month = base.getMonth()+1<10? '0' + (base.getMonth()+1) : base.getMonth()+1
        let date = base.getDate()<10? '0' + base.getDate(): base.getDate()
        let hour = base.getHours()<10 ? '0' + base.getHours(): base.getHours()
        let minute = base.getMinutes()<10 ? '0' + base.getMinutes(): base.getMinutes()
        let second = base.getSeconds()<10 ? '0' + base.getSeconds(): base.getSeconds()


        return base.getFullYear()+"年" + month + "月" + date+ "日" +" " + hour+":"+minute+":"+second

    }



    setInterval(function () {
        let now = new Date()
        let s = timeFomatter(now)
        $("#cur_time").html(s)
    }, 1000)

    biggest_temp_diff.setOption(get_word_cloud_biggest_temp_diff_option())

    let lastPixelRatio = window.devicePixelRatio;
    window.addEventListener('resize', function () {
        console.log('页面缩放变化了');
        chart_list.forEach(chart => {
            chart.resize()
        })
        word_cloud.resize()
        biggest_temp_diff.resize()
    });
})